<template>
    <div class="dialog-head-icon">
        <el-tooltip v-if="back" content="上一个" placement="bottom">
            <i class="el-icon-back"></i>
        </el-tooltip>
        <el-tooltip v-if="next" content="下一个" placement="bottom">
            <i class="el-icon-right"></i>
        </el-tooltip>
        <el-tooltip v-if="goback" content="返回" placement="bottom" style="margin-left:40px;">
            <i class="el-icon-top"></i>
        </el-tooltip>
        <el-tooltip v-if="prev"  content="前进" placement="bottom">
            <i class="el-icon-bottom"></i>
        </el-tooltip>

        <el-tooltip v-if="screen" content="全屏" placement="bottom">
            <i class="el-icon-full-screen" @click="clfun" style="margin-left:40px;"></i>
        </el-tooltip>
    </div>
</template>

<script>
  module.exports = {
    name: 'dialog-tools',
    props: [
      'back', 'next', 'goback', 'prev','screen'
    ],
    methods: {
      clfun () {
        console.log(222)
        this.$emit('clickfullscreen')
      }
    }
  }
</script>

<style scoped>

    .dialog-head-icon {
        position: absolute;
        right: 50px !important;
        top: 15px;
    }

    .dialog-head-icon [class^="el-tooltip el-icon-"] {
        font-size: 28px;
        font-weight: 100;
        cursor: pointer;
        color: #999;
        margin: 0 0px;
    }

    .dialog-head-icon [class^="el-tooltip el-icon-"]:hover {
        color: #606266;
    }
</style>
